

<template>
<div>
     <!-- <Button type="primary" @click="modal1 = true">Display dialog box</Button> -->
     <Modal v-model="mode" width="40%" title="订单编辑" @change="testChange"  @on-cancel="cancel">
         <Row>
          <Form ref="ordersData" v-model="ordersData"  :label-width="100">
                <div style="width:100%;height:auto;margin:0 auto;">
                     <Col span="24">
                       <FormItem label="订单编号：" prop="ordersCode">
                          <Input v-model="ordersData.ordersCode" class="orders_disabled" placeholder="请输入用车单位" disabled ></Input>
                       </FormItem>
                     </Col>
                    <Col span="12">  
                       <FormItem label="用车部门：" prop="userId">
                            <Select class="dept" v-model="ordersData.userId" :placeholder="ordersData.deptName + '-' + ordersData.userRealname" style="width:200px;">
                              <Option v-for="item in deptList" :value="item.userId" :key="item.userId">{{ item.deptName }}-{{item.userRealname}}</Option>
                            </Select>
                      </FormItem> 
                       <FormItem label="联系人：" prop="ordersRider">
                        <Input v-model="ordersData.ordersRider" placeholder="请输入联系人"></Input>
                      </FormItem> 
                     <FormItem label="出发地点：" prop="ordersStartAddr">
                        <Input v-model="ordersData.ordersStartAddr" placeholder="请输入出发地点"></Input>
                     </FormItem> 
                      <FormItem label="出发时间：" prop="ordersStartTime">
                           <DatePicker type="date" placeholder="请选择出发时间" format="yyyy-MM-dd HH:mm:ss" v-model="ordersData.ordersStartTime" style="width:100%;"></DatePicker>
                      </FormItem> 
                                                
                    </Col>
                    <Col span="12">
                       <!-- <FormItem label="用车类型：" prop="gender">
                            <RadioGroup v-model="ordersData.modeId">
                                <Radio label="1">公务</Radio>
                                <Radio label="2">执法</Radio>
                            </RadioGroup>
                        </FormItem>  -->
                        <FormItem label="申请车型：" prop="vehModelId" >
                            <Select v-model="ordersData.vehModelId" placeholder="请选择申请车型" style="width:200px;">
                              <Option v-for="item in vehList" :value="item.vehModelId" :key="item.vehModelId">{{ item.vehTypeName }}</Option>
                            </Select>
                        </FormItem> 
                        <FormItem label="联系方式：" prop="ordersRiderMobile"  >
                            <Input v-model="ordersData.ordersRiderMobile" placeholder="请输入联系电话" ></Input>
                        </FormItem>
                          <FormItem label="目的地点：" prop="ordersAimAddr">
                                <Input v-model="ordersData.ordersAimAddr" placeholder="请输入目的地"></Input>
                        </FormItem> 
                          <FormItem label="用车天数：" prop="ordersEndTimeNum">
                                <Input v-model="ordersData.ordersEndTimeNum" placeholder="请输入用车天数"></Input>
                        </FormItem>       
                     
                    </Col>
                    <Col span="24">
                        <FormItem label="用车事由：" prop="ordersReason">
                            <Input v-model="ordersData.ordersReason" style="width:500px;" type="textarea" :autosize="{minRows: 2,maxRows: 5}" placeholder="请说明用车事由..."></Input>
                         </FormItem>
                    </Col>
                    </Col>
                    <Col span="24">
                        <FormItem>
                            <Button type="primary" :loading="loading"  @click="handleSubmit('ordersData')">提交</Button>
                            <!-- <Button @click="handleReset('formValidate')" style="margin-left: 8px">重置</Button> -->
                         </FormItem>
                   </Col>
                   
                </div>
              </Form>
        </Row>


        <div slot="footer" >
            <!-- <Button type="error" size="large" long :loading="modal_loading" @click="del">Delete</Button> -->
        </div>
    </Modal>
</div>
</template>

<script>
import util from "../../../libs/util.js";
import {getUserlist,getVehlist,subOrderData} from "@/api/data";
import { formatDate } from '../../../components/date.js';
export default {
    name: 'Tableedit',
    data () {
        return {
          loading:false,
          mode:this.edit,
          deptList:[],
          vehList:[],
          listdata:[]

        };
    },
    props:{
        edit:{
            type:Boolean ,
            required:true
        },
        ordersData:{
            type:Object,
            required:true 
        },
        data1:{
           type:Array,
           required:true
        }


    },
    methods: {
       testChange(val){
        this.$emit('testChange',val);
       },
       cancel(){
           this.loading = false; 
          let data = {
            mode:false
          }
          this.$emit('headCallBack', data);
       },
       //提交
         handleSubmit(name) {
           this.loading = true; 
         this.$refs[name].validate(valid => {     
            if (valid) {       
                this.submit();
            } else {
            this.$Message.error("请填写相关信息!");
            }
      });
    },
      submit(){
        const data = {
            'sysUserBySysUserId.userId':this.ordersData.userId,
            'vehModel.vehModelId':this.ordersData.vehModelId,
            ordersRider:this.ordersData.ordersRider,
            ordersRiderMobile:this.ordersData.ordersRiderMobile,
            ordersStartAddr:this.ordersData.ordersStartAddr,
            ordersAimAddr:this.ordersData.ordersAimAddr,
            ordersStartTime:formatDate(new Date(this.ordersData.ordersStartTime), 'yyyy-MM-dd hh:mm:ss'),
            ordersEndTimeNum:this.ordersData.ordersEndTimeNum,
            ordersReason:this.ordersData.ordersReason,
            ordersId:this.ordersData.ordersId,
            ordersStatus:10,
        };
        subOrderData(data).then(res =>{
            if(res.flag == 1){
              this.$Message.success("提交成功");
              this.loading = false; 
              let data = {
                mode:false
              }
              this.$emit('success', data);   
            }else if(response.data.flag == 0){
            this.$Message.success("提交失败"); 
            }else if(response.data.flag == 2){
            this.$Message.success("状态过期");
            }
        }).catch(error => {
            this.$Message.error("请核对之后重新提交");
             this.loading = false; 
       });


     },
    },
    mounted () {
            const data ={};
            getUserlist(data).then(res =>{
              this.deptList = res;
            }),
            getVehlist().then(res =>{
              this.vehList = res;
            })
    },
    watch: {
        edit(val) {
        this.mode = val
    }
}
}
</script>
<style>
.dept .ivu-select-placeholder{
color:#515a6e!important;
}
</style>